import { _decorator, Component, Node, Label, Button } from 'cc';
import { BaseView } from '../../../../scripts/libs/rxjs/cc3/BaseView';
import { ReactiveProperty } from '../../../../scripts/libs/rxjs/cc3/ReactiveProperty';
import { BindButton } from '../../../../scripts/libs/rxjs/cc3/BindButton';
import { gm } from '../../../../scripts/managers/GameManager';
import { SubgameConfig } from '../../../../scripts/managers/SubgameConfig';
const { ccclass, property } = _decorator;

@ccclass('SubgameButton')
export class SubgameButton extends BaseView {

    subgameKey = ReactiveProperty.Create(null);

    @property(Label)
    keyLabel: Label = null;

    @property(Button)
    selfButton: Button = null;

    useObserves() {
        return [
            this.subgameKey.subscribe(this.refresh.bind(this)),
            BindButton(this.selfButton).subscribe(this.selfButtonClicked.bind(this)),
        ];
    }

    refresh() {
        if (!this.subgameKey.value) return;
        this.keyLabel.string = this.subgameKey.value;
        let config = SubgameConfig[this.subgameKey.value];
        if (config.name != null) {
            this.keyLabel.string = `${this.subgameKey.value} - ${config.name}`;
        }
    }

    selfButtonClicked() {
        this.log('selfButtonClicked', this.subgameKey.value);
        gm.enterGameCommand.execute(this.subgameKey.value);
    }
}

